<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="${pageContext.request.contextPath }/static/js/jquery-3.3.1.js"></script>

<link rel="stylesheet" href="${pageContext.request.contextPath }/static/css/jquery.datetimepicker.css">
	<script src="${pageContext.request.contextPath }/static/js/jquery.datetimepicker.js"></script>
	<link rel="stylesheet" href="${pageContext.request.contextPath }/static/css/ion.calendar.css">
	<script src="${pageContext.request.contextPath }/static/js/moment.min.js"></script>
	<script src="${pageContext.request.contextPath }/static/js/moment.zh-cn.js"></script>
	<script src="${pageContext.request.contextPath }/static/js/ion.calendar.min.js"></script>
	<link rel="stylesheet" href="${pageContext.request.contextPath }/static/css/avgrund.css">
	<script type="text/javascript" src="${pageContext.request.contextPath }/static/js/avgrund.js"></script>
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/static/css/menu_sideslide.css" />
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/static/css/normalize.css" />
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/static/css/bootstrap.min.css" />
	<script type="text/javascript" src="${pageContext.request.contextPath }/static/js/bootstrap.min.js"></script>
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/static/css/iconfont.css" />
	<link rel="shortcut icon" href="../img/favico.ico" type="image/x-icon">
	
    <style>
        .weather{
           margin: 30px 0 20px 30px;
        }
        .content-left{
            float: left;
            border-right: 1px solid #ddd;
            width: 100%;
            box-shadow: 2px 2px 4px #777777;
            margin-top: 3px;
        }
        .content-left-weather{
            margin: 0 auto;
            border-bottom:  1px solid #ddd;
            width: 100%;
        }
        .mynavbar{
            position: relative;
        }
        .menu-button{
            position: absolute;
            top: -10px;
            left:-5px;
        }
    </style>
	<script type="text/javascript">
		$(function(){
			
		
		$(".start_date").datetimepicker({
            lang:'ch',
            format:'Y-m-d',
            formatDate:'Y-m-d',
            timepicker:false
        });
        $(".end_date").datetimepicker({
            lang:'ch',
            format:'Y-m-d',
            formatDate:'Y-m-d',
            timepicker:false
        });
		});

        $(function(){
        	$("#calendar").ionCalendar({
                lang: 'zh-cn',
                format: 'YYYY年M月D日',
                onClick: function(date){
                	var code = "<%=request.getParameter("code")%>";
                	var user=$("#user1").val()
                	if(code==1 ||user!=""){
                	var time=new Date(Date.parse(date.replace('年','-').replace('月','-').replace('日','')))
                    console.log(time)
                    var d=new Date(time);
                    var year=d.getFullYear();
                    var month=change(d.getMonth()+1);
                    var day=change(d.getDate());
                    var time=year+'-'+month+'-'+day;
                    
                    /* alert(time); */
                    openDialog();
                    function change(t){
                        if(t<10){
                            return "0"+t;
                        }else{
                            return t;
                        }
                    }
                   // var user=$("#user1").val()
                   var user="<%=request.getParameter("user")%>"
                    var param_data={
                    	'user':user,
                    	'start_date':time
                    }
                   /*  alert(user); */
                    $.ajax({
                    	type:"POST",
                        url:"${pageContext.request.contextPath }/selectSchedule.action",
                        data:{'param':JSON.stringify(param_data)},
                        dataType:"json",
                        async:false,
                        success:function(data){
                        	console.log(data)
                            if(data != ""){
           						var tbl=""
           						
           						var text3="edit_sch"
                       		 	for(var i=0;i<data.length;i++){
                       		 	var text1="${pageContext.request.contextPath }/deleteSchedule.action?id="+data[i].id
               					var text2="${pageContext.request.contextPath }/SelectOne.action?id="+data[i].id
                       			 tbl+="<p><span>主题</span>：<span>"+data[i].theme+"</span></p><p><span>开始时间</span>：<span>"+data[i].start_date+" "+data[i].start_time+"</span></p><p><span>结束时间</span>：<span>"+data[i].end_date+" "+data[i].end_time+"</span></p><p><span>人员</span>：<span>"+data[i].staff+"</span></p><p><span>说明</span>：<span>"+data[i].instruction +"</span></p>"+"<p><a href='"+text1+"' class='margin-right:15px'>删除</a>"+"<a href='"+text2+"' class='"+text3+"'>修改</a></p>"
                       		}  		    	
                 		     $(".detail_content").html(tbl);
                            }else{       
                            	$(".detail_content").html("您没有添加事件");
                            }
                        }
                    });
                }else{
                	//alert("您还未登录！");
                }
                }
            
            });
            
        });
	</script>
	<script type="text/javascript">

        function openDialog() {
            Avgrund.show( "#default-popup" );
        }

        function closeDialog() {
            Avgrund.hide();
        }

	</script>
	
	<script type="text/javascript">
        $(document).ready(function(){
        	var code = "<%=request.getParameter("code")%>";
        	if(code==0){
        		
                 
                var ch22 = document.getElementById("login");
                ch22.style.visibility="visible";
        	}else if(code==1){
        		
                 
                var ch22 = document.getElementById("login");
                ch22.style.visibility="hidden";
                
        	}
        	
        });
    </script>
    <script type="text/javascript">
    $(function () {
    	$("#daojishi").on("click",function(){
    		var code = "<%=request.getParameter("code")%>";
    		
    		if(code==1){
    			var user="<%=request.getParameter("user")%>"
    			var now_time = getNowTime();
       			var param_data3={
                    	'user':user,
                    	'now_time':now_time,
                    }
    			 console.log(param_data3)
    			$.ajax({
    				type:"POST",
                    url:"${pageContext.request.contextPath }/findAlltimeback.action",
                    data:{'param':JSON.stringify(param_data3)},
                    dataType:"json",
                    async:false,
                    success:function(data){
                    	console.log(data)
                    	if(data==""){
                    		$(".content-right-table").html("<div class='card'><div class='card-body'><div style='text-align: center;'><img src='../img/empty.svg'><p>NO DATA</p></div></div></div>")
                    	}else{
                    		
                    		 var tbl = "<table class='table table-striped'>";
                    		 tbl+="<thead><tr><th>事件</th><th>日期</th><th>地点</th><th>倒计时</th><th>删除</th><th>修改</th></tr></thead><tbody>"
                    		 for(var i=0;i<data.length;i++){
                    			 var text1="${pageContext.request.contextPath }/DeleteCount.action?id="+data[i].id;
                    			 var text2="${pageContext.request.contextPath }/SelectOneCount.action?id="+data[i].id;;
                    			 var text3="editcount btn btn-primary"
                    			 var text4="nexttime"
                    			 var text5="informtime"
                    			 tbl+="<tr><td>"+data[i].event+"</td><td class='"+text4+"'>"+data[i].end_time+"</td><td>"+data[i].place+"</td><td class='"+text5+"'>"+data[i].informtime+"</td>"+"<td><a href='"+text1+"' class='btn btn-outline-danger'>删除</a></td>"+"<td><a href='"+text2+"' class='"+text3+"'>修改</a></td></tr>"
                    		 }
                    		 tbl += '</tbody></table>';
                    		 $(".content-right-table").html(tbl);
                    	}
                    }
    			});
    			$(".content-right").show()
    		}
    		
    		else{
    			alert("您还未登录！");
    		}
    		var next=document.getElementsByClassName("nexttime");
    		var informtime=document.getElementsByClassName("informtime");
    		console.log(informtime);
    		console.log(next[0].innerText)
    		console.log(informtime[0].innerText)
    		for(var i=0;i<next.length;i++){
    			 (function(e) {
    			var nexttime=new Date(next[i].innerText);
    			console.log(nexttime)
    			window.setInterval(function(){
    				var currenttime=new Date();
    				var currentTime = currenttime.getTime();
    	            var nextTime = nexttime.getTime();
    	            var allTime = nextTime - currentTime;
    				console.log(allTime)
    	            var allSecond = parseInt(allTime / 1000);
    				
    	            // 8.转化   重要
    	            var d = size(parseInt(allSecond / 3600 / 24));
    	            var h = size(parseInt(allSecond / 3600 % 24));
    	            var m = size(parseInt(allSecond / 60 % 60));
    	            var s = size(parseInt(allSecond  % 60));
    	            console.log(d +"天"+ h +"小时" + m +"分钟"+ s +"秒")
    	            console.log(informtime)
    	            informtime[e].innerHTML=d +" "+ h +"：" + m +"："+ s;
    			},1000);
    			 })(i);
    		}
    		});
    	$('#daojishi').trigger("click");
	function size(num) {
        return num >= 10 ? num : '0' + num;
    }
	
	function getNowTime() {
        var date = new Date();
        var seperator1 = "-";//年月日分隔符
        var seperator2 = ":";//时分秒分隔符
        var month = date.getMonth() + 1; //月份是0~11，要加1为当前月
        var strDate = date.getDate();
        if (month >= 1 && month <= 9) {
            month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
            strDate = "0" + strDate;
        }
        var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + " " + date.getHours() + seperator2 + date.getMinutes() + seperator2 + date.getSeconds();
        return currentdate;
    }
	
});
    </script>
    
    <script>
    	$(function(){
    		var user="<%=request.getParameter("user")%>";
    		var code = "<%=request.getParameter("code")%>";
    		if(code == 1){
    			
    		
    		$.ajax({        			
    			type:"GET",
    		    url:"/Schedule/findPerson.action",
    		    contentType:"application/json;charset=utf-8",  
    		    //我们使用 JSON.stringify() 方法处理json，将其转换为字符串；
    		    data:{
    		    	'user':user
    		    },
    		    dataType:"json",
    		    async:false,
    		    success:function(result){
    		   
    		    	 if(result.code==1){
    		    		
    		         var data=result.data;
    		    		 //console.log(data);
    		         var img = ""
    		    		 if(data.avatar === undefined){
    		    			 img = '../img/touxiang.jpg'
    		    		 }else{
    		    			 img = '/image/'+data.avatar
    		    		 }	
    		    			        		    		  		    
             		 $("#left-name").html(data.name);
             		 $("#left-phone").html(data.phone);
             		 $(".touxiang").attr('src',img);
    		    	 }else if(result.code==-1){
    		    		 alert("获取用户失败");
    		    	 }      		    	
    		    }        		    
    		});
    		}else{
    			//alert('您还未登录');
    		}
    	});
    </script>
   
    <script>
    	$(function(){
    		
    		//获得今日的日程
    		function getNowTime() {
		        var date = new Date();
		        var seperator1 = "-";//年月日分隔符
		        var seperator2 = ":";//时分秒分隔符
		        var month = date.getMonth() + 1; //月份是0~11，要加1为当前月
		        var strDate = date.getDate();
		        if (month >= 1 && month <= 9) {
		            month = "0" + month;
		        }
		        if (strDate >= 0 && strDate <= 9) {
		            strDate = "0" + strDate;
		        }
		        var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate 
		        return currentdate;
		    }
    		
    		var user="<%=request.getParameter("user")%>";
    		var code = "<%=request.getParameter("code")%>";
    		 var param_datas={
                 	'user':user,
                 	'start_date':getNowTime()
                 }
    		 //console.log(param_datas);
    		 if(code == 1){
    			 $.ajax({
                 	type:"POST",
                     url:"${pageContext.request.contextPath }/selectSchedule.action",
                     data:{'param':JSON.stringify(param_datas)},
                     dataType:"json",
                     async:false,
                     success:function(data){
                     	//console.log(data)
                     	 var tbl = "";
                         if(data != ""){
        						
        						for(var i = 0;i<data.length;i++){
        							
        							tbl +="<div class='alert alert-warning alert-dismissible fade show' role='alert'>"
                                    tbl += "<strong>"+data[i].theme+"</strong>"
        							tbl += "<span class=' float-right' style='font-size:16px'>"+data[i].start_date+" "+data[i].start_time+"</span></div>"
        							
        						}
        						$('.today-schedule').html(tbl);
                    		}  		    	
                         else{
                        	 tbl = "<div class='alert alert-success' role='alert'>"
                        	 tbl += "<h4 class='alert-heading'>Well done!</h4> <hr>"
                        	 tbl += "<p class='mb-0'>You have no agenda for today,Enjoy the day.</p></div>"
                             $('.today-schedule').html(tbl);
                         }
                     }
                 });
    		 }else{
    			 //alert('您还未登录');
    		 }
    		 
    	});
    </script>
    <script>
    $(function () {
		$("#shouye").click(function () {
			var code = "<%=request.getParameter("code")%>";
			
			
			if(code==1 ){
				location.href="../static/jsp/main.jsp?code="+<%=request.getParameter("code")%>+"&user="+"<%=request.getParameter("user")%>";
			}
			else{
				alert("您还未登录！");
			}
			
        });
		$("#schedu").click(function () {
			var code = "<%=request.getParameter("code")%>";
			
			if(code==1){
				location.href="schedule.jsp?code="+<%=request.getParameter("code")%>+"&user="+"<%=request.getParameter("user")%>";
			}
			else{
				alert("您还未登录！");
			}
			
        });
		$("#daojishi").click(function () {
			var code = "<%=request.getParameter("code")%>";
			
			if(code==1){
				location.href="backtime.jsp?code="+<%=request.getParameter("code")%>+"&user="+"<%=request.getParameter("user")%>";
			}
			else{
				alert("您还未登录！");
			}
			
        });

       $("#rob").click(function () {	
			var code = "<%=request.getParameter("code")%>";
			if(code==1){
					location.href="robot.jsp?code="+<%=request.getParameter("code")%>+"&user="+"<%=request.getParameter("user")%>";
			}
			else{
				alert("您还未登录！");
			} 					
        });	
       $("#message").click(function () {	
			var code = "<%=request.getParameter("code")%>";
			if(code==1){
				location.href="message.jsp?code="+<%=request.getParameter("code")%>+"&user="+"<%=request.getParameter("user")%>";
			}
			else{
				alert("您还未登录！");
			} 					
       });	
     $(".lianliankan").click(function(event){
    	   //event.preventDefault();
    	   var code = "<%=request.getParameter("code")%>";
			if(code==1){
				location.href="lianliankan.jsp?code="+<%=request.getParameter("code")%>+"&user="+"<%=request.getParameter("user")%>";
			}
			else{
				alert("您还未登录！");
			} 	
       });
       $(".pingtu").click(function(event){
    	   //event.preventDefault();
    	   var code = "<%=request.getParameter("code")%>";
			if(code==1){
				location.href="pingtu.jsp?code="+<%=request.getParameter("code")%>+"&user="+"<%=request.getParameter("user")%>";
			}
			else{
				alert("您还未登录！");
			} 	
       }); 
       $("#set").click(function(event){
    	   //event.preventDefault();
    	   var code = "<%=request.getParameter("code")%>";
			if(code==1){
				location.href="setinfo.jsp?code="+<%=request.getParameter("code")%>+"&user="+"<%=request.getParameter("user")%>";
			}
			else{
				alert("您还未登录！");
			} 	
       }); 
		
    });
    </script>
<title>时间安排</title>
</head>
<body >

	<div class="menu-wrap" >
						<div class="media" style="padding: 10px 50px;width: 300px;position:absolute;top:20px;left:0;border-bottom:1px solid #e8e8e8">
				            <img class="mr-3 touxiang" src="../../img/touxiang.jpg" style="width: 48px;height: 48px;border-radius: 50%">
				            <div class="media-body">
				                <h5 class="mt-0" style="font-size: 14px;color:#fff" id="left-name">未登录</h5>
				                <span style="font-size: 13px;color:#fff" id="left-phone"></span>
				            </div>
        				</div>
        			
						<div class="today-schedule" style="width:299px;position:absolute;top:93px;left:0;overflow:auto">
							
							
						</div>
  
				<div  class="out" style="position:absolute;left:15px;bottom:15px;font-size:14px">
					<a id="set" data-target="" href="#"><i class="iconfont" style="margin-right:5px">&#xe61c;</i><span>设置</span></a>
					<a id="loginout" data-target="" href="../static/jsp/main.jsp?code=0"><i class="iconfont" style="margin-right:5px">&#xe792;</i><span>退出</span></a>
				</div>
				
				<button class="close-button" id="close-button">Close Menu</button>
			</div>
<header>
        <nav class="navbar navbar-expand-lg navbar-dark bg-dark mynavbar">
            <div class="navbar-brand" href="#"><button class="btn btn-dark" id="open-button">个人中心</button></div>
            <div class="collapse navbar-collapse" id="navbarNavDropdown" style="margin-left: 100px">
                <ul class="navbar-nav">
                    <li class="nav-item active" id='shouye'>
                        <a class="nav-link" href="#" style="margin-left:200px">首页<span class="sr-only">(current)</span></a>
                    </li>
                    <li class="nav-item" id="schedu">
                        <a class="nav-link" href="#">日程安排</a>
                    </li>
                    <li class="nav-item" id='daojishi'>
                        <a class="nav-link" href="#">倒计时</a>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                           小游戏
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                            <a class="dropdown-item pingtu" href="#" id="pt">拼图</a>
                            <a class="dropdown-item lianliankan" href="#">连连看</a>
                        </div>
                    </li>
                    <li class="nav-item" id='rob'>
                        <a class="nav-link" href="#" >智能机器人</a>
                    </li>
                </ul>
            </div>
            <ul class="nav">
                <li class="nav-item">
                    <a class="nav-link disabled" href="#" id="message" style="color:#fff"><i class="iconfont" style="margin-right:5px">&#xe605;</i>消息</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link disabled" href="login.jsp" id="login" style="color:#fff"><i class="iconfont" style="margin-right:5px">&#xe63a;</i>登录</a>
                </li>
            </ul>
        </nav>
    </header>
	<div class="container-fluid" >
        <div class="row">
            <div class="content-left col-md-3 d-none d-lg-block" >
                <div class="content-left-weather ">
                    <iframe class="weather" name="weather_inc" src="http://i.tianqi.com/index.php?c=code&id=55"  width="255" height="294" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
                </div>
                <div class="">
                    <div class="jq22" style="width: 300px;margin-top: 35px;margin-left: 25px;margin-bottom: 60px">
                        <div id="calendar"></div>
                    </div>
                </div>
            </div>
            <div class="content-right col-md-9" style="margin-top: 8px">
                <div>
            		<div class="card">
						  <div class="card-body align-middle">
						    One of these days is none of these days.
						    <button type="button" class="btn btn-warning float-right" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo"><i class="iconfont" style="margin-right:5px">&#xe65e;</i>添加倒计时</button>
						  </div>
						</div>
            	</div>
                <div class="content-right-table" style="margin-top:30px;overflow:auto"></div>
            </div>
        </div>
    </div>			
<div class="avgrund-cover"></div>
<aside id="default-popup" class="avgrund-popup">
	<h2 style="font-size:18px">今日安排</h2>
	<div class="detail_content" style="height: 190px;overflow: auto" >
		
	</div>
	<button onClick="javascript:closeDialog();" class="btn btn-primary" style="position:absolute;bottom:10px;right:20px">Close</button>

</aside>
	<!--添加倒计时的模态框  -->
	<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabe2">New message</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form action="${pageContext.request.contextPath }/AddCount.action" method="POST">
					<input type="hidden" value="<%=request.getParameter("user") %>" name="user" >
                    <div class="form-group">
                        <label for="event" class="col-form-label">主题:</label>
                        <input type="text" class="form-control input_theme" id="event" name="event" placeholder="创建一个事件主题">
                    </div>

                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="inputDate3">结束日期</label>
                            <input type="text" class="form-control end_date" id="inputDate3" name="end_time" value="">
                        </div>
                        <div class="form-group col-md-3">
                            <label for="inputHour_end">小时</label>
                            <select id="inputHour_end" class="form-control select_hour" name="end_hour">
                                <option value="00">00</option>
                                <option value="01">01</option>
                                <option value="02">02</option>
                                <option value="03">03</option>
                                <option value="04">04</option>
                                <option value="05">05</option>
                                <option value="06">06</option>
                                <option value="07">07</option>
                                <option value="08">08</option>
                                <option value="09">09</option>
                                <option value="10">10</option>
                                <option value="11">11</option>
                                <option value="12">12</option>
                                <option value="13">13</option>
                                <option value="14">14</option>
                                <option value="15">15</option>
                                <option value="16">16</option>
                                <option value="17">17</option>
                                <option value="18">18</option>
                                <option value="19">19</option>
                                <option value="20">20</option>
                                <option value="21">21</option>
                                <option value="22">22</option>
                                <option value="23">23</option>
                                
                            </select>
                        </div>
                        <div class="form-group col-md-3">
                            <label for="inputMin_end">分钟</label>
                            <select id="inputMin_end" class="form-control select_minute" name="end_minute">
                                <option value="00">00</option>
                                <option value="10">10</option>
                                <option value="20">20</option>
                                <option value="30">30</option>
                                <option value="40">40</option>
                                <option value="50">50</option>
                                
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="input_place" class="col-form-label">地点:</label>
                        <input type="text" class="form-control input_par" id="input_place" name="place" >
                    </div>
                    <div class="form-group">
                        <label for="input_backtime" class="col-form-label">倒计时:</label>
                        <input type="text" class="form-control" id="input_backtime"  name="informtime" readonly="readonly">
                    </div>
                    <div class="modal-footer">
                        <input type="button" class="btn btn-secondary  form_reset" data-dismiss="modal" value="Close">
                        <input type="button" class="btn btn-primary form_submit" value="Add">
                    </div>
                </form>
            </div>

        </div>
    </div>
</div>
	<script src="${pageContext.request.contextPath }/static/js/classie.js"></script>
	<script src="${pageContext.request.contextPath }/static/js/main.js"></script>
	<script type="text/javascript">
		$(function(){
			$(".form_submit").click(function(){
				//alert('123');
				var theme=$(".input_theme").val()
				if(theme==""){
					alert("添加失败");
				}else{
					$(this).prop("type","submit");
				}
			});
		})
	</script>
</body>
</html>